<script setup>
  const props = defineProps({
    title: {
      type: String,
      required: false,
      default: 'Veuillez corriger les erreurs suivantes',
    },
    errors: { type: Object, required: true },
    getFormFieldData: { type: Function, required: true },
  })
</script>
<template>
  <div class="alert alert-danger" v-if="errors && Object.keys(errors).length">
    <p>Veuillez corriger les erreurs suivantes :</p>
    <ul>
      <li v-for="(message, field) in errors" :key="field">
        {{ getFormFieldData(field).label }} :
        {{ message }}
      </li>
    </ul>
  </div>
</template>
